<div class="detail-view-container">
  <div class="container-bg"></div>
  <div class="detail">
    <div class="header">
      <a class="back-arrow" routerLinkActive="active" [routerLink]="['../']">
        <svg fill="#FFFFFF" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
          <path d="M0 0h24v24H0z" fill="none"/>
          <path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/>
        </svg>
      </a>
      <!-- <div mat-card-avatar [style.background]="'#c7b7dd'">{{demandInfo.title|name2avatar}}</div> -->
      <div class="header-text" *ngIf="mode!='new'">
        <div class="header-name">{{demandInfo.title}}</div>
        <div class="header-detail">{{demandInfo.detail | delHtmlTag}}</div>
      </div>
      <div class="header-text" *ngIf="mode=='new'">
        <div class="header-name">新建需求</div>
      </div>
      <!-- <div class="header-text">
        <div class="header-name">{{demandInfo.title ? demandInfo.title : "新建需求"}}</div>
        <div class="header-detail">{{demandInfo.detail ? (demandInfo.detail | delHtmlTag) : "需求描述"}}</div>
      </div> -->
    </div>
    <mat-card class="">
      <mat-card-content>
        <div class="dialog-content">
          <form action="" [formGroup]="demandForm" (ngSubmit)="onSubmit('one')">
            <div class="demand-detail-content">
              <mat-form-field>
                <input matInput placeholder="需求名称" [formControl]="title" [(ngModel)]="demandInfo.title" name="title"
                       [readonly]="!isOperate">
                <mat-error>{{formErrors.title}}</mat-error>
              </mat-form-field>

              <div class="editor">
                <span>需求描述</span>
            <quill-editor [formControl]="detail" [(ngModel)]="demandInfo.detail" [modules]="modules"></quill-editor>
              </div>

              <mat-form-field>
                <input matInput placeholder="任务指定(编辑需求时不可指定任务)" [formControl]="assignTask"
                       [(ngModel)]="demandInfo.activityTittle" name="activityTittle" readonly>
              </mat-form-field>

              <mat-form-field>
                <mat-select placeholder="优先级" [formControl]="level" [(ngModel)]="demandInfo.level" name="level"
                            [disabled]="!isOperate">
                  <mat-option value="low">低</mat-option>
                  <mat-option value="normal" aria-selected="true">中</mat-option>
                  <mat-option value="high">高</mat-option>
                </mat-select>
                <mat-error>{{formErrors.level}}</mat-error>
              </mat-form-field>

              <mat-form-field>
                <input matInput placeholder="创建时间(创建时间不可设置)" [formControl]="createAt" [(ngModel)]="demandInfo.createAt"
                       name="createAt" readonly>
              </mat-form-field>
            </div>

            <div class="detail-footer" *ngIf="isOperate">
              <button mat-button (click)="cancel()">取消</button>
              <button mat-button type="submit" [disabled]="!demandForm?.valid">{{mode == 'new' ? '新建' : '修改'}}</button>
              <button mat-button *ngIf="mode=='new'" type="button" [disabled]="!demandForm?.valid"
                      (click)="onSubmit('again')">再次新建
              </button>
            </div>

            <div class="detail-footer" *ngIf="!isOperate">
              <button mat-button (click)="cancel()">返回</button>
            </div>
          </form>
        </div>
      </mat-card-content>
    </mat-card>
  </div>
</div>

<toaster-container [toasterconfig]="toasterconfig"></toaster-container>

